/*
 * @Author: CPS
 * @Date: 2020-07-25 18:01:11
 * @Last Modified by:   Administrator
 * @Last Modified time: 2020-08-03 17:17:00
 * @Projectname Electron-fileWatcher
 * @Filename index.js
 */

'use strict'
/* css 样式 */
import './css/smallNoification.stylus'

/* 图片资源 */
import icon from './icon.js'

import smallNoification from './smallNoification.pug'
import './smallNoification.stylus'

// 定义组件前缀名
function prefix(name) {
  return 'smallNoification__' + name
}

class notifiObject {
  constructor(target) {
    this.id = 0
    this.el = null
    this.content = null
    this.icon = icon
    this.smallNotis = smallNoification
    this.history = []
    this.settings = {
      icon: icon,
      msg: {
        title: '(161332) 翁瑞珠 打印3本',
        content: '文件夹被创建了!!!'
      }, //消息内容
      max: 3, //最大同时存在的通知数量
      dir: 0, //通知生成的方向
      delay: 6000, //消失时间
    }

    if (target) {
      switch (target.toString()) {
        case '[object HTMLElement]':
          //传入的时一个element类型
          this.el = target
          break;

        default:
          let tmp = document.getElementById(target);
          if (tmp) {
            this.el = tmp
          }
          break;
      }
    } else {
      this.el = document.createElement('section')
      this.el.id = this.el.className = 'smallNoification__component'
    }

    /* 判断tar的类型 */
    switch (target ? target.toString() : '') {
      case '[object HTMLElement]':
        // 传入的是一个html实例,将其作为父元素,挂载
        if (target.className.indexOf(prefix('component')) == -1) target.className += ' ' + prefix('component')
        this.el = target
        break

      case '':
        //传入了空值，尝试查找文档下是否存在 fileList__component 为id的元素
        this.el = document.getElementById(prefix('component'))
        if (this.el) break
        return

      default:
        // 传入的不是html实例,默认当作id名,尝试查找是否存在该ID
        this.el = document.getElementById(tar.toString());
        break
    }

    this.el.addEventListener('click', (e) => {
      switch (e.target.className) {
        case 'smallNoification__btn-close':
          console.log('点击了关闭按钮')
          this.el.removeChild(e.target.parentNode)
          break;
        default:
          console.log('我被点击了:' + e.target.className)
          break;
      }
    })

    return this
  }

  pushMsg(newSettings) {
    Object.assign(this.settings, newSettings)

    // 超过指定数量,进行删减
    if (this.el.childElementCount >= this.settings.max) {
      if (this.settings.dir) {
        this.el.removeChild(this.el.firstElementChild)
      } else {
        this.el.removeChild(this.el.lastElementChild)
      }
    }

    // 将消息添加到历史记录
    if (this.settings.msg) {
      this.history.push(this.settings.msg.toString())
    }

    let tar
    // 根据不同方向,生成标签
    if (this.settings.dir) {
      this.el.innerHTML = this.el.innerHTML + this.smallNotis(this.settings)
    } else {
      this.el.innerHTML = this.smallNotis(this.settings) + this.el.innerHTML
    }

    this.delMsgInterval(this.el)
  }

  delMsgInterval(tar) {
    if (this.id) return //不重复添加监听器

    //设置每隔一段事件删除旧的通知
    this.id = setInterval(() => {
      if (!tar.childElementCount > 0) {
        clearInterval(this.id)
        this.id = 0
      } else {
        tar.lastElementChild.style.opacity = 0
        setTimeout(() => {
          tar.removeChild(tar.lastElementChild)
        }, 1000, tar)
      }
    }, this.settings.delay, tar)
  }
}

export default (target) => {
  return new notifiObject(target)
}
